<template>
  <div v-if="leftPanelShow" class="left-panel">
    <component :is="leftPanel"> </component>
  </div>
</template>

<script lang="ts">
import { Vue, Component } from "vue-property-decorator";
// import BasePaenl from "./CBase.vue";
import Video from "./CVideo.vue";
@Component({
  name: "LeftPanel",
  components: {
    // BasePaenl,
    Video,
  }
})
export default class extends Vue {
  get leftPanel() {
    return this.$store.getters["videoPanel/leftPanel"];
  }
  get leftPanelShow() {
    return this.$store.getters["videoPanel/leftPanelShow"];
  }
}
</script>

<style lang="scss" scoped>
.left-panel {
  position: absolute;
  height: 987px;
  width: 468px;
  pointer-events: none;
  background: #001022;
  padding: 0 20px;
  & > * {
    pointer-events: auto;
  }
}
</style>
